Me preguntaba Emiliano el otro día si había forma de personalizar los títulos de la sidebar con imágenes diferentes. La respuesta es SI.
Hace poco Junio explicaba como añadir una imagen a los títulos sin usar CSS, de esta misma forma podemos añadir la imagen y que esta sea diferente en cada widget.
Debemos ir a plantilla Edición de HTML y expandir la plantilla de artilugios.
Como hablamos de añadir la imagen en los títulos de la sidebar buscaremos:
<div id='sidebar-wrapper'>

A partir de ahí veremos algo así:

<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Label1' locked='false' title='Etiquetas' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'>
<data:label.name/>
</span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
<data:label.name/>
</a>
</b:if>
<span dir='ltr'>(<data:label.count/>)</span>
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

El ejemplo anterior contiene las etiquetas del blog, como podéis ver el widget abre con la etiqueta <b:widget... y cierra con </b:widget>

La etiqueta que buscamos es <data:title/> y se encuentra rodeada de <h2> y </h2> que son etiquetas de encabezamiento.

<h2><data:title/></h2>

Añadiremos la imagen justo antes de la etiqueta <data:title/>

<h2><image src='url-imagen'/><data:title/></h2>

Para añadir las siguientes imágenes seguiriamos la misma pauta buscando los widgets que tenemos añadidos a nuestra sidebar (nos podemos guiar por los títulos)

Hay que tener en cuenta que la imagen no sea demasiado grande, tipo icono estará bien, si añadimos un tamaño excesivo el título se desplazaría.

Perder miedo a manipular la plantilla, pero no está demás ser precavido y ver los resultados en otro blog. Todo es cuestión de probar y mirar en vista previa.



Alexander Dmitrievich

interesante, le da un toque de independencia a cada elemento.

Responder
Alexander Dmitrievich

Por cierto, necesitaré algo de ayuda Gem@, espero no molestar.
Estaba viendo en Vagabundia un truco para poner feeds como menú, me ha gustado el efecto, pero yo ya tengo mi menú y sólo me gustaría tener ventanas desplegables, pero con mi propio contenido en vez de feeds.
aquí esta el artículo, me podrías ayudar?

Responder
CarlosCarrión

Abra que ponerse a buscra imágenes...Un saludo

Responder
alejandra

y tienes un premio en: http://dechicaslindas.blogspot.com/2008/08/premio-blog-perfecto.html

Responder
Gem@

Hola Alejandra antes de añadir la imagen de fondo personalicé los comentarios siguiendo Estos pasos.
Pero si lo que deseas es añadir una imagen de fondo en cualquier comentario busca:

/* Profile
-------------- */
Y añadiendo:
.comment-body {
background:url('url-imagen-de-fondo');
margin:0;
padding:7px 7px 7px 7px; /*Modified padding values*/
}

Responder
Julio Pulido

Hola Gema, después de varios días visitando tu página, sólo darte las gracias por la inestimable ayuda que, sin tu saberlo muchas veces, ofreces al que se quiere personalizar un blogger y no sabe como hacerlo. Gracias a tu página que me recomendo un amigo y a los enlaces que nos brindas he podido personalizar mi blog. Evidentemene estás enlazada en él.
Muchísimas gracias por todo, Julio Pulido.
www.vista-cansada.blogspot.com

Responder
Gem@

Bienvenido Julio Pulido, es muy grato recibir comentarios como el tuyo, cualquier cosa que necesites estaré encantada de ayudarte.

Responder
Gem@

Carluso disculpa que no contestara tu comentario me di cuenta ahora, y bueno... probando se aprende y descubre que no es tan complicado como parece ;)

Soviet: Mejor lo veo y te cuento ;)

Responder
alejandra

gracias gema

Responder
Alexander Dmitrievich

Gracias Gem@,

También me gustaría invitarte a formar parte de Revista MS, hay varias categorías, tu apoyo sería bienvenido, checa la página de afiliación.

Responder
Admin

Muy lindo gem@ y se ve fácil no? Acostumbrada a tremendos cambios y códigos esto me parece fácil ja ja
Gracias por pasar por el blog, y si, lo logré con la ayuda de Pizcos como me recomendaste, pero ahora Rosa me ha contestado a mi comentario de la otra vez y veremos que hago, ella lo hace distinto y sale la parte de abajo, voy a ver bien como es el asunto...

Besotes ;)

Responder
Gem@

Soviet, he estado leyendo el articulo de J.Miur pero no entiendo que tiene que ver con el contenido en ventanas desplegables.
Mándame mejor un mail y me explicas con más detalle lo que deseas hacer.


K_nelita es un gran adelanto, ahora ya tienes dos posibilidades.
Ya me contarás porque en verdad que es una asignatura pendiente.
Besotes ;)

Responder
Gem@

Soviet me olvidé agradecerte el ofrecimiento que me haces, visitaré Revista MS, pero no puedo comprometerme a nada porque el tiempo no me da para más.
Aún así me verás por allí ;)

Responder
Alexander Dmitrievich

No te preocupes, la dinamica consiste simplemente en poner el banner y dejar que algo de tu contenido aparezca allá, siempre referido hacia tí.
Si quieres checa las bases en el blog de la revista.
Apenas tenga tiempo te mando bien el correo de lo que quiero decir, tal vez por la falta de este no me he podido expresar bien, incluso ahora estoy en una prisa.

Responder
Gem@

Si es así adelante ;)

Responder
Carlos Pizcos

Hola madrina!!!...para cuando la explicacion sobre el css de las widetabs, que tengo varias solicitudes de como se hace???...jajajaja...☺☺☺...como no tienes ya bastante, vengo a darte mas trabajo...saludos compi...

Responder
Gem@

jajajajaja eres tremendo pero mira por donde a mi también me lo han pedido, asi que mañana toca personalizar las widetabs aunque poco hay para personalizarlas que no sea sobre modificar colores o fondo.
Un abrazo compi :)

Responder
alejandra

aqui tienes un premio
es por tu ayuda y ya te e enlazado bay

Responder
Gem@

Muchas gracias Alejandra, hace tiempo decidí no seguir cadenas pero eso no quita para que te agradezca de corazón el detalle.
Gracias por enlazarme :)

Responder
Admin

El asunto de las imagenes era, según Pizcos, que no tenía que ponerlas enteras, solo el comienzo, o sea la parte de arriba y lo demás darle color, el mismo claro que la imagen, entonces si se expande con el leer mas y cubre todo sin sobreponerse a nada, así de simple...
Ahora Rosa me ha hecho de muestra, pero en otra plantilla, mas o menos lo mismo, creo porque todavía no fui a ver si había explicaciones, solo vi la muestra, pero en esta ocasión sale la parte final de la imagen, o sea se ve el principio y el final de la imagen y el resto se rellena con color.
Así que mira tu lo que era... y nosotras rompiendonos la cabeza y la imagen entera no iba, bueno algo aprendimos no??
Besotes ;)

Responder
germanbg

me da un poco de respeto. En cualquier caso, si encuentro una buena imagen, lo haré.
SALU2

Responder
alejandra

no importa tengo muchas amigas q no sigen las cadenas de premios aparte ese premio lo e echo yo y no le puse reglas asi q no lo otorges si tu quieres. bay

Responder
Gem@

k_nelita vi la muestra de Rosa, ha sido una genial idea, creo que se ha basado en la plantilla Rounders que presenta las esquinas redondeadas yo creo que ha sido un acierto, tampoco me detuve en buscar las explicaciones pero deben andar por alguna parte :(

kyle xy siempre queda la opción de probar en una plantilla a modo de juego, si sale bien y si no... volvemos a intentarlo ;)

Gracias Alejandra eres un cielo ;)

Responder
Admin

Si gem@ es la Rounders, pero por mucho que busques no hay ninguna explicación, intenté copiar del código fuente de la muestra en mi blog de pruebas con la Minima y no funciona, no sale imagen alguna, le pregunté a Rosa pero todavía no hay respuestas...:'(
Besotes ;)

Responder
Alexander Dmitrievich

Ok, que bueno que me ayudes con este proyecto, en cuanto reuna más gente empezaré a poner el contenido.
Puedes poner el enlace de una vez, eso me serviría para convocar a más personas a ser parte del proyecto.
Que estés bien.

Responder
Alexander Dmitrievich

Gem@,
Ya está tu review en Revista MS, así como el enlace a tu blog, en breve empezarás a ver tu contenido en la revista, siempre referido hacia tí, espero puedas invitar a tus lectores a formar parte del proyecto.
Un saludo.

Responder
Anónimo

Gema, cuando se pincha en tu blog en Entradas anteriores salen los titulos de 2 entradas cada vez. Sería bueno, creo yo, que pusieras mas entradas para no tener que estar dándoles tantas veces. Es sólo una sugerencia.
Saludos

Responder
Leonel

Hola Gem@!, amo tu blog, siemplemente es de muchas ayuda y es exactamente eso lo que vengo a pedirte, tu ayuda, que espero, que me la puedas dar tan amablemente como eres. Mira, estoy tratando de abrir un blog sobre Ali Lohan, algo asi como un fansite y eh viste un truqito javascript que me encanto y realmente lo queria para mi site. Nose como llamarlo, pero puedo describirlo diciendo que es una foto hipervincular, le pasas el mouse y cambia la foto. Simplemente genial!, pues eh estado algo asi como 3 horas buscando la solucion cuando finalmente la encontre, pero despues tuve otro problema: Cuando intentaba poner dos fotos juntas , con el mismo efecto pero solamente cambia la imagen que esta primera. Para ser mas especifico, le pongo a los dos enlaces con el mismo efecto, el de cambiar al pasar el mouse y solo cambia al primero, no al segundo, aunque el mouse este sobre la segunda fotos. Luego le dedique otra hora mas al buscar la solucion a este problema, y por mas codigo distinto y 'mejorado' que encuentre no modifica nada y sigue pasando lo mismo. Insisto tanto porque eh visto este fansite de Ashley Tisdale en su seccion de elites afiliados, con el mismo efecto y al parecer, no tiene el mismo problema que yo, si ves, si pasas el mouse por la segunda foto cambia la segunda foto, si lo pasas por la tercera, por la tercera y no como me pasa a mi, que por mas que pase por el que pase, me cambia siempre la primera!. Espero haber sido claro, desde ya muchas gracias y espero ancioso tu respuesta! Saludos!

Responder
Pily

Pues lo he probado Gema y si me ha salido¡¡ Me da siempre mucha emociòn hacer este tipo de cambios porque la verdad es que me cuesta muchìsimo trabajo entenderle a los còdigos.

Ahora, ya me ha quedado la imàgen en mi sidebar que yo querìa PERO ¿como le puedo quitar la imàgen que por default me sale, y que queda al lado de la imàgen que acabo de poner? Esa que estè de color rosa, como un rectàngulo, es la que quiero quitar.
De antemano, muchas gracias¡¡¡ :D

http://pilyboop.blogspot.com/

Responder
Gem@

Hola k_nelita espero que el tema esté resuelto, pasaré por tu blog para ver que cambios llevas ahora entre manos ;)

Hola Soviet pasaré por allí aunque aún no me dijiste de qué trata el blog o la temática del mismo.
Yo creo que lo mejor es que tu hagas una entrada dando información detallada, yo no tengo idea y por lo tanto poco puedo informar o invitar ;)

Anónimo pues no me había dado cuenta y es algo que se agradece, intentaré solucionarlo ;)
GRACIAS.

Leonel voy a ver ese enlace que me dejas y te comento ;)

Hola Pilyboop, esa imagen la puedes eliminar situándote en .sidebar h2 {
Busca:
background: url(http://www.blogblog.com/thisaway_rose/icon_sidebar_heading.gif) con borrar lo que está en negrita es suficiente.
Mira en vista previa el resultado ;)

Responder
Admin

Hooooooola gemit@ opra vez al ruedo ehh ;) que bien!!
No, lo de las imagenes me quedé con lo de Pizcos, y allí lo dejo, Rosa no respondió mas, así que no hay información al respecto, quedará así.

Y si pasas por el blog verás lo que tengo entre manos, pero ahora te lo voy a postear en su lugar correspondiente, porque preciso ayuda, que raro no?? ja ja :D :D

Besotes ;)

Responder
Gem@

Leonel ese efecto es un rollover, utiliza dos imágenes, una en color y otra en blanco y negro (esta última añadida dos veces )
Yo hice una entrada que explica con detalle lo que es un rollover pero La Bloguería se acerca más en esta entrada a lo que estás buscando ;)
Si no te orientas bien házmelo saber ;)

Responder
Pily

Muchas gracias Gema¡¡¡ :D

Responder
Gem@

Voy mirando los comentarios k_nelita, espero encontrar lo de la imagen :)

De nada Pilyboop ;)

Responder
Anónimo

Yo tengo las etiquetas como tu con el +/- (cuando navegas por ellas).

La pregunta es ¿se podra desde el post poner una imagen diferente en cada (en lugar de los calendarios que muchos tienen)

Espero que me entiendas la idea jejeje

Gracias por leerme

Responder
Gem@

Te entiendo a medias Hector jajajaja y no me río porque no te expliques bien sino porque sabías que no te entendería.
¿Te refieres a esos calendarios que son una imagen tipo hoja de almanaque?
¿Una imagen diferente junto al título de las entradas ?

Responder
Eroz

A ver jajajajajaajaja es que esta medio complicado jajajaja mira ahí voy de nuevo.

Supongamos ahorita yo estoy en tu página le doy en la etiqueta blogger (arriba) y me muestra algo así:

[+/-] Seguimiento de (aquí imagen)
Comentarios en el nuevo editor

[+/-] Imagen diferente en (aquí imagen)
Los títulos de la sidebar

[+/-] Widebar simple (aquí imagen)

Ahora entonces mi duda es donde dice (aquí imagen) ¿hay alguna forma de ponerle una imagen diferente a cada post? .

¿Algo complicado no? jjajajaaa .

Muchos dirán y este loco pa que quiere eso jaajajajaja pues supongamos que queremos hablar de un Cd que nadie ubica el nombre ni el cantante pero si la portada (ya sabes que a veces somos mas visuales).

Jajajaajajaa bueno ya me voy por que si no aquí termino el post.

(Por cierto soy el Hetor) jajajajaa nomas que no andaba con mi sesión iniciada y pues se me hizo mas rápido.

Responder
Eroz

Yo de nuevo jajajaaja andaba buscando algo no tan rompecabezas jajajaaja y me encontré con el leer mas.... aunque algo chocoso ponerle tanto código en el post jajajaaja (y luego uno se queja de por que tarda tanto en cargar jajajajaa)

Sabes algo que note en el leer mas (que te manda a otra pagina es que no carga todo lo que ocultas) bualaaaaaaa una maravilla así cuando se navega por etiquetas pues no se hace taaaaaaaaaaaaaan pesada la pagina =)

Y con la otra forma el +/-que te mostré anteriormente si carga todo aunque no se vea y eso lo note por que abajo en mi explorador se volvía loquito conectándose a cosas que yo ni veía jajajajajaajaa.

Reclámame ¡Anda! ¡Anda! ¡Dime! que es tu blog y que los post los pones tu jajajajaaa.

Ya pues me retiro y muchas gracias gem@ por tu blog tan útil.

Responder
Gem@

jajajajajaja mira Hector esto no me ha pasado nunca, normalmente suelo leer las cosas un par de veces y no es manía jajajajja es por aquello de comprender bien lo que me están explicando.
Pero contigo no pude leer la segunda porque me da un ataque de risa, es cierto que la risa es contagiosa ¿pero leyendo? jajajaja que fuerte.
Veamos..que respiro hondo jajajaja
Lo primero lo he entendido,ejem...
Supongamos que clicas en Blogger o en cualquier etiqueta y te muestra una relación de entradas:
[+/-] Seguimiento de ..
[+/-] Imagen diferente en ..
[+/-] Widebar simple ..
La imagen quedaría al lado del título por lo tanto aparecería también en las entradas.
Puedes probar de un modo muy simple, añadiendo la imagen manualmente cuando editas la entrada.
Algo así:
"Este es el título de la entrada" <img src="url-de-la-imagen"/>
Por lógica la imagen sería de un tamaño tipo icono de lo contrario quedaría muy desplazada.
Estoy adivinado tu pensamiento, y dirás que menuda trabajada tener que hacer eso cada vez ¿no? Pues no, puedes facilitar el trabajo añadiendo el código d ela imagen en la plantilla de entrada de esa forma aparecerá cada vez que vas a editar una nueva entrada y sólo debes copiar y pegar junto al título.

Lo segundo.... un sistema de leer más pero que no tenga efecto de mover la página ¿no? o ¿si? jajajajaja si es así hay formas de hacerlo simplemente añadiendo un script a la plantilla y que el modo de leer más sea como un bloqueanimado.
También hay otro modo que a mi me gusta mucho pero es cuestión que lo vieras.
mira aquí
Ya me dirás algo :)

Responder
Leonel

Gema, Muchas gracias! Justamente, estoy pasando por algo similar a lo que vos pasaste, estoy esperando mi pc nueva porque la otra ya tenia demaciados problemas, y ahora estoy en un cyber, en cuanto tenga mi pc, te aviso si tu ayuda me sirvio! Saludos

Responder
Gem@

Hola Leonel espero que te llegue pronto el PC, si necesitas algo que te lleve tiempo hacer en el ciber y puedo ayudarte me lo dices :)

Responder
Eroz

Mmmmmmm ok ok ahí va de nuevo
Hola Gem@ pues tienes toda la razón la risa es contagiosa hasta en la lectura, no se me había ocurrido poner así la imagen directa en donde va el titulo y vaya que le pico le pongo le quito como se diría en la vida real subo bajo de un lado al otro y luego se me bloquea la plantilla y me pregunto por que será? Jajajajajaaj pero no importa corro a recordar lo que hice y tengo mis plantillas guardadas (a veces luego se me olvida).
Respecto al leer mas creo que me conviene mas que se abra en otra pág. por que si no se cargaría mucho la ventana.
Haaaaaaa sep y de las imagencitas creo que esta mejor de esta manera así le doy dimensiones a la imagen reduciéndola a cierto tamaño cosa que no se si se pueda en el leer mas (aunque creo que lo hace mas pesado por los tamaños de las imágenes) y si no se puede imagínate llenaría de favicones el cibermundo 1 imagen por cada post jjajaajajaja.
Mil gracias por tu ayuda.
(Notas como cada comentario mío podría ser un post jajaajajaja muuuuuuuuuuy mal hecho pero un post jjajajaajaja)
¿Siempre he tenido la pregunta acaso no tienes un blog escondido por ahí? Tengo suficientes bases para creerlo pero por más que investigo mmmmmmmm no doy como jajajaajajajaa.
Seguiré haciéndola de detective 00p2.

Responder
Eroz
Este comentario ha sido eliminado por el autor.
Responder
Eroz

Yupi Yupi lo paso lo paso!!!!!!! algo me decia que se ponian los comentarios automaticamente.

Responder
Gem@

Saludos Eroz espero qu elo del leer más te salga bien.
¿Un blog escondido? ¿sabes que me lo preguntan varias veces? jajajaja tengo muchos blogs, algunos de prueba, otros con ejemplos para las entradas, otros tantos en los que participo y algún que otro con plantillas modificadas por mi que espero publicar algún día. Pero si te refieres a un blog personal en estos momentos no lo tengo. No me queda tiempo para hablar sobre mi :)
(hiciste un buen trabajo con la plantilla, me gusta el efecto transparencia, hace poco yo hablaba sobre ese tema)
Suerte :)

Responder
Jazziturno
Este comentario ha sido eliminado por el autor.
Responder
Jazziturno

¡Hola Gema!

Quiero iniciar un segundo Blog, empecé con el cutrediseño hace un ratito. Estoy modificando la plantilla 'Minima'. Tirando de photoshop está quedando más o menos como quiero; lo que pasa es que de HTML no tengo mucha idea; pero gracias a tí y a investigar poniendo cosillas en el Blog desde el que te escribo, estoy defendiéndome un poco.

Mi duda es... que no sé cómo hacer para que el título de los elementos de la Sidebar aparezcan dentro de la imagen que puse. ¡Soy un negado! Me queda así: http://reporteropeyote.blogspot.com

Por ahora sólo puse el fondo y la cabecera.

Gracias por adelantado, que entre lo que me enrrollo y la de comentarios al día que tendrás que atender...

¡Un beso! Y felices fiestas otra vez

Responder
Reportero Peyote

Soy JAZZITURNO

¡Lo conseguí!

Gracias a esto: http://gemablog-.blogspot.com/2008/03/personalizar-los-ttulos-de-la-sidebar.html

Como no, en tí está la solución jajaja.

Peeero... ¿No podría cuadrar el título con la imagen? ¿La única forma es modificar la imagen?

Gracias de nuevo !!!

Responder
Reportero Peyote

¡Ya lo conseguí también!

Lo logré jugando con los "padding", y he resuelto un par de cosillas más, aunque aún tengo algunas por conseguir todavía.

¡Siento ser pesado! Pero quería avisarte para que no te molestases en contestar.

Un besazo :)

Responder
Gem@

Jazziturno ¿peasado? ni hablar todo lo contrario soy yo la que tiene que pedirte disculpas por no haber contestado antes pero me ha sido imposible y lo siento de veras no haber estado cuando lo requerías :)
Por otra parte me alegra tus progresos.
Felices Fiestas por si no, nos vemos :)

Responder
Reportero Peyote

¡Pero qué dices Gema! Por Dios por Dios jajaja, pedir disculpas; ¡ni por asomo! Si además casi no te he dado tiempo a contestar. Es que soy más seguidooo... Y más estando en fiestas :)

Gracias por alegrarte, me hace mucho ilusión e ir avanzando poquito a poco, ¡pensé que no iba a ser capaz! Pero a base de probar y abusar de la vista previa, va bien.

Ahora se plantea otra duda, que con todo el rostro del mundo te lo planteo, por si puedes darme una idea ^^, es la siguiente:

La imagen que pongo tras los títulos de las entradas, me aparece descuadrada según el navegador. Yo uso firefox, y ahí queda tal como quiero, pero al entrar desde I. Explorer, se ve malll... He hecho una captura para que veas a qué me refiero:

http://img242.imageshack.us/img242/7522/resultadomr2.png

¿Hay solución? ¿O cierro el Blog antes de abrirlo? Jajajajaja. Muchas gracias desde ya :) ¡Y sin prisas! Por favor.

¡¡¡Felices fiestas a tí también!!!

Que las disfrutes :)

Responder
majka.

Hola, guapetona!

Soy Majka, molestando otra vez... No sé por qué motivo en lugar de todas la imágenes que he puesto en la sidbar, aparece un cartelito (maldito)de boxstr alert.

Este es el servidor, pero en el mismo sevidor tengo la cabecera y otras imágenes, pque se ven perfctamente...

Las imágenes son .jpg, así está bien o tienen que ser .png o .gif ?

soy un poco desastre!

Gracias por tu valioso tiempo! ;)

Responder
Dian'sStudio

Hola Gema, siempre que visito tu blog es para empaparme de cositas nuevas que gracias a tí podemos hacer cosas que quiza nunca se nos cruzaron por la mente.
Te escribo también porque tengo un pequeño problema eh realizado pasao a paso todo lo que has explicado para colocar las imagenes y todas me salen perfectamente, exepto una gaget que es el de seguidores.. no se cual es el problema... como te comento el resto de gaget en todos me sale las imagenes menos en ese y yo de html entiendo poco, porfa ayudame porque yo le doy y le doy vueltas y no se donde está el problema. Un besito grandote y desde ya gracias por tu ayuda.
Espero tu contestación.
http://davitydiana.blogspot.com/

Responder
Gem@

:: Hola Diana, en ese tema no voy a poder ayudarte porque el gadget de seguidores está dando problemas desde hace bastante tiempo y es algo que hasta donde o sé no se puede solucionar.
Hay quien dice que ve el gadget y otros no pueden ver el mismo gadget, parece que sea cosa de los navegadores pero no sabría decirte :(

Responder
Dian'sStudio

Gracias Gema por tu respuesta.. la verdad que yo ya no sabia que hacer.. y ya con lo que me dices por lo menos descanso de estar buscando cual era el problema.. esperemos y esto se solucione porque como tu dices es un problema que va arrastrando el gaget seguidores desde hace mucho tiempo segun estube mirando despues de ver tu respuesta.

Un besito y que tengas un buen fin de semana.

Responder
Gem@

:: Es cuestión de esperar que Blogger lo solucione igual que hizo con el avatar de comentarios.

Responder
Canelaytu

Hola Gema:

He tratado de insertar un icono delante del ecabezado de mis etiquetas y me aparece la dirección que pego en el blog y después la palabra Etiquetas.....

Si pudieras decirme a qué es debido....
Muchas gracias

Responder
Gem@

:: Hola Raquel, eso puede ser porque la url de la imagen no está entre las comillas pero tendría que verlo para ser más concreta :)

Responder
Canelaytu

Hola de nuevo Gema!!!

Fantástico el tutorial!!!!! si que sale!!!!
Pero por qué le añade un fondo blanco a la foto?

Le quito el fondo con photosop, pero una vez que la sube le añade un fondo blanco.... y queda fatal....

Responder
Gem@

:: Raquel a la url de la imagen que te da Blogger cambia la parte del tamaño puede ser s200 - s320 - s400 si le pones s000 no reduce la imagen y es posible que ese fondo desaparezca.
De todas formas es que sin verlo no puedo decirte mucho más :S

Responder
Canelaytu

Eres un genio!!!!!!! :D
Muchísimas gracias!!!!
Mira, este es el resultado:
http://canelaytu.blogspot.com/

Me gustaría que no apareciesen las etiquetas tan separadas, pero bueno, poco a poco.

Voy a mirar más cositas en tu blog que está fenomenal y muy bien excplicado. Además contestas muy rápido a las dudas. Muchas gracias!!!

Responder
Gem@

:: Ha quedado estupendo :)
Para esa separación que me comentas puedes solucionarlo de la siguiente forma.
En tu plantilla hay un aparte que dice:
.sidebar .widget, .main .widget {
border-bottom:1px dotted #FFBBE8;
margin:0 0 1.5em;
padding:0 0 1.5em;
}

Son los estilos de los widgets para la sidebar y main, lo que hacemos es dividirlos para que cada parte tenga sus propios estilos, eliminamos lo anterior y añadimos algo así:

.main .widget {
border-bottom:1px dotted #FFBBE8;
margin:0 0 1.5em;
padding:0 0 1.5em;
}

.sidebar .widget {
border-bottom:1px dotted #FFBBE8;
margin:0 0 1.5em;
padding:0 0 1.5em;
}

En sidebar .widget puedes modificar esa separación aunque para hacerlo más sencillo yo eliminaría la parte de padding:0 0 1.5em; y en su lugar añadiría padding: 4px 0; aumentando o disminuyendo el 4 verás en vista previa que tal queda.

Responder
Canelaytu

Lo hago pero no noto que suceda nada.... Se queda igual.... No se...

Responder
Gem@

:: No veo ne tu blog que tengas modificado ese primer paso de separar los widgets de main y sidebar :S
.sidebar .widget, .main .widget {
border-bottom:1px dotted #FFBBE8;
margin:0 0 1.5em;
padding:0 0 1.5em;
}

Responder
Canelaytu

Menuda Rapidez!!!! :D

Gracias por responder tan pronto.
Sí que lo hice, pero al ver que no pasaba nada lo volví a poner como antes.... Porque como no me aclaro con esto del blog tengo miedo meter la pata....

Responder
Canelaytu

Lo he dejado modificado tal y como me dices, pero no sucede nada.... :-|

Responder
Gem@

:: Claro que no funcionaba lo que yo te estaba indicando es para dejar menos espacio entre los widgets y ahora me doy cuenta que lo que deseas es dejar menos espacio entre el texto de las etiquetas.
Ese texto es un listado al igual que los archivos y es lo que hay que modificar (siento el tiempo que te hice perder) por eso me gusta ver los cambios se ven las cosas con más claridad.
En la plantilla viene así:

.sidebar li {
margin:0;
padding-top:0;
padding-right:0;
padding-bottom:.25em;
padding-left:15px;
text-indent:-15px;
line-height:1.5em;
}

En line-height es el espacio entre líneas si en lugar de line-height:1.5em; pones line-height:1.2em; quedará menos espacio.

Responder
Canelaytu

A ver si me puedo explicar mejor.
Me refiero al espacio que hay entre la frase: ver todo mi perfil y recetas por ejemplo.
Y así con todos esos espacios de esa columna.

Gracias :)

Responder
Gem@

:: Ah bien entonces te había entendido bien la primera vez, quieres menos espacio entre el gadget de etiquetas y el del perfil.
Eso si es en
.sidebar .widget {
border-bottom:1px dotted #FFBBE8;
margin:-10px 5px;
padding:0 0 1.5em;
}

Prueba con esa medida, el -10 es el espacio que puedes disminuir o aumentar aunque de esa forma yo lo veo muy pegado.

Responder
Canelaytu

Fantástico!!!!!!! :D

Muchísimas gracias!!! Eres un encanto!! no me puedo creer que hayas contestado tan rápido!!

Responder
Gem@

:: No siempre ocurre Canelaytu aquí juega mucho el factor coincidencia (estar conectados a la misma hora) :)

Responder
Lesent

Hola Gem@ aplique tus instrucciones, estuvieron muy fáciles. Gracias. Solo tengo un pequeño problema. Añadí un widget Lista de Links queriendo darle apariencia de periodico (voy a publicar noticias) el asunto es que la imagen que puse para el titulo del widget me aparece con un padding de 10px, cuando lo puse en cero todos los titulos del sidebar se me corrieron 10 px a la izquierda osea quedan pegados al borde de sus propias imágenes. Cómo hago que solo el background del titulo de ese widget tenga cero pixeles de padding?

Responder
Lesent

Por cierto, mi blog es www.guiaglbtecuador.com. Sorry me olvide.

Responder
Gem@

:: Saludos Lesent puedes intentarlo de este modo:
background-image:url("http://farm5.static.flickr.com/4049/4520692567_e8ae3f732b_o.jpg") no-repeat scroll left top;

Responder
Lesent

:( No funcionó, no pasó nada... la imagen de la cabecera del widget sigue movida a la derecha, todo lo demás está bien.

Responder
Gem@

:: Pues no puedo seguir mirando Lesent porque ya no está.

Responder
Kas-Tro

Felicidades por tu blog, mi consulta es que quiero subtituir el titulo completo por una imagen este es mi blo de pruevas http://prueba2056.blogspot.com/ y la imagen me keda ensima del titulo y a un lado me puedes ayudar con eso.. gracias..

Responder
Kas-Tro

hey que esta bien lo conegui con otro tutorial que vi..

Responder
Tanika

Hola Gem@,

Creo que tengo un problema con la sidebar.
He insertado los códigos tal como dices pero nada de nada.
Hace tiempo inserté el icono bajo cada entrada donde aparece mi nombre pero no hay manera de insertarlos en los títulos de la sidebar, no sé si tiene que ver con los bordes redondeados que puse hace tiempo.

Te dejo mi blog
http://www.tani-ka.blogspot.com/

Un saludo, y gracias por adelantado!!

Responder
Tanika

Gem@, ya está resuelto! era problema de la url de la imágen.
Gracias por todo tu trabajo!!

Un saludo.

Responder
Gem@

:: Me alegra esté solucionado Tania, gracias por avisar es un detalle que se agradece :D

Responder
itext

Gran Gema, reconozco con un poco de rubor que visito a menudo tu blog para extraer una u otra enseñanza y pocas veces lo agradezco.

Un enorme saludo desde Uruguay para ti.

Responder
Gem@

:: De rubor nada wtext, no hay que sentirse obligado a comentar aunque hay que reconocer que siempre es agradable que nos digan que las ideas o la información que dimos fueron útiles en algún momento. Hoy comentaste y te lo agradezco :D

Responder
lateralxizquierda

Hola. Quisiera saber si existe la posibilidad de colocar imagenes en el lugar de lo que actualmente tengo, bloques de color verde.
Las dimensiones de la imagen son pequeña, es por eso que deberia repetirse en lo horizontal.
Saludos y gracias

http://petroleroazulgrana.blogspot.com

Responder
Gem@

:: + en la siguiente url puedes ver la forma de añadir una imagen en los títulos de la sidebar

http://gemablog-.blogspot.com/2008/03/personalizar-los-ttulos-de-la-sidebar.html

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top